Tanstack RouterでVirtual File Routes

ファイルベースとコードベースのいいとこ取り

code:ts

import {

rootRoute,

route,

index,

layout,

physical,

} from '@tanstack/virtual-file-routes'

// 例: ルート構造を定義

export const routes = rootRoute('root.tsx', [

index('index.tsx'), // "/" に対応

layout('pathlessLayout.tsx', [

route('/dashboard', 'app/dashboard.tsx', [

index('app/dashboard-index.tsx'),

route('/invoices', 'app/dashboard-invoices.tsx', [

index('app/invoices-index.tsx'),

route('$id', 'app/invoice-detail.tsx'),

]),

]),

physical('/posts', 'posts'), // ディレクトリ丸ごとマウント

]),

])